<template>
    <div>
        <div class="width-75 m-t-28">
            <i class="iconfont icon-cha fs-28" @click="$router.back(-1)"></i>
        </div>
        <div class="tc m-t-6 p-b-10 bb-1-e">
            <img src="../img/logo.png" alt="" class="register-logo">
        </div>
         <nav>
            <ul>
                <li class="width-75 bb-1-e z-header">
                    <span class="c-b1">手机号:</span>
                    <input type="text" class="b-0" v-model="username">       
                </li>
                <li class="width-75 bb-1-e z-header flex">
                    <div>
                       <span class="c-b1">验证码:</span>
                        <input type="text" class="b-0" v-model="Code">     
                    </div>
                    <div class="code tc" @click="code" v-if="!codoButton">
                        获取验证码
                    </div>
                    <div class="code tc" v-if="codoButton">
                        {{Time}}
                    </div>
                </li>
                <li class="width-75 bb-1-e z-header">
                    <span class="c-b1">密码:</span>
                    <input type="text" class="b-0" v-model="Password">       
                </li>
                <li class="width-75 bb-1-e z-header">
                    <span class="c-b1">确定密码:</span>
                    <input type="text" class="b-0" v-model="qPassword">       
                </li>
                <li class="tc">
                    <button class="register-button c-f b-c2" @click="register">确定</button>
                </li>
                 
            </ul>
        </nav>
    </div>
    </div>
</template>
<script>
    import Vue from 'vue'
    import { MessageBox } from 'mint-ui';
    import {vali , z} from '../assets/js/common'
    Vue.prototype.$vali = vali

    export default {
        data(){
            return{
                username : '',
                Code :　'',
                Password : '',
                qPassword : '',
                 codoButton: false,
                 Time:60
            }
        },
    
        methods:{
            code(){
                var params = new URLSearchParams();
                params.append("mobilePhone", this.username);
                //调用封装的函数
                if(this.$vali(this.username, /^1[0-9]{10}$/, "请输入正确的手机号")==true){
                    this.$http({
                        method: 'post',
                        url: localPath + '/user/doCode',
                        data: params
                    }).then((response) => {
                        this.count();

                        this.codoButton = true;
                        console.log(response);
                        
                    }).catch((error) => {
                        console.log(error);
                    })
                }       
            },
            count() {
                var second = 60;
                var timer = setInterval(()=>{
                    second -= 1;
                    if (second > 0) {
                        this.Time = second;
                     
                    } else {
                        this.codoButton = false;
                    }
                }, 1000);

        },
            register(){
                    //提示消息
                    var params = new URLSearchParams();
                    params.append("username", this.username);
                    params.append("Password", this.Password);
                    params.append("newCode", this.Code);
                    if(this.$vali(this.username, /^1[0-9]{10}$/, "请输入正确的手机号")==false){

                    }else if(this.$vali(this.Password, /^\d{6}$/ , "请输入6位数字密码")==false){
                         
                    }else if(this.qPassword != this.Password){
                        // console.log("两次密码不一致");
                         MessageBox.alert("两次密码不一致");
                    }else{
                        
                        this.$http({
                            method: 'post',
                            url: localPath + '/user/updatePassword2',
                            data: params
                        }).then((response)=>{
                            console.log(response);
                             MessageBox.alert(response.data.message);
                             if(response.data.message == "操作成功"){
                                 this.$router.push({path: '/login'});
                             }
                            // this.$message(this.popUp);
                        }).catch((error)=>{
                            console.log(error);
                        })
                    }            
            },
        },
        mounted() {
            document.addEventListener(z());
        },
    }
</script>
<style>
</style>
